import React, {useEffect, useRef} from 'react';
import {useLocation} from "react-router-dom";
import LogFactory from "log/LogFactory";
import {SecurityUserType} from "type/SecurityUser";
import { Button, Card, Input, Slider, Space} from "antd";
import {requestGet, requestPut} from "util/request";
import Tree from "antd/es/tree/Tree";
import type { DataNode } from 'antd/es/tree';
import { EditOutlined, SettingOutlined } from '@ant-design/icons';
import {compareArray} from "util/compare";
import {AuthorityHandleTreeData} from "type/AuthorityHandleTreeData";
import InitHandler from "global/InitHandler";
import GlobalHandler from "global/GlobalHandler";

const IconFont = InitHandler.getInstance().getIconFont() ;
const log = LogFactory.getLog("UserAuthorityComponent") ;
const UserAuthorityComponent = () => {
    const user: SecurityUserType = useLocation().state ;

    const userKeys = useRef<string[]>([]);
    const [checkedKeys,setCheckedKeys] = React.useState<string[]>([]) ;
    const [treeData, setTreeData ] = React.useState<DataNode[]>([]) ;

    useEffect(() => {
        requestGet<AuthorityHandleTreeData>("/manager/security-user-role/update/" + user.id)
            .then(res => {
                setTreeData(res.data.treeData.map(e => {
                    e.icon = <IconFont type={e.icon as string} /> ;
                    return e;
                })) ;
                userKeys.current = res.data.authorityKeys ;
                setCheckedKeys(res.data.authorityKeys) ;
            }) ;
    },[]);

    const onsubmit = () => {
        let update = compareArray(userKeys.current, checkedKeys);
        // log.debug("修改结果比较", update);
        if (update.isUpdate) {
            update.id = user.id;
            delete update.isUpdate;
            requestPut<number>("/manager/security-user-role", update)
                .then(res => {
                    if (res.data > 0){
                        GlobalHandler.getInstance().sendSuccessMessage("修改成功!") ;
                        userKeys.current = checkedKeys ;
                    }else {
                        GlobalHandler.getInstance().sendErrorMessage("修改失败!");
                    }
                }) ;
        }else {
            GlobalHandler.getInstance().sendInfoMessage("没有被修改的用户权限") ;
        }
    };

    const onCheck = (checkedKeysValue: any) => {
        // log.debug('修改后的用户key数组', checkedKeysValue);
        setCheckedKeys(checkedKeysValue) ;
        // log.debug("未修改用户权限key数组",userKeys.current) ;
    };

    return (
            <Card
                title={"用户权限修改"}
                extra={ <Space.Compact>
                    <Button type="primary">{user.username}</Button>
                    <Input style={{width: '100px'}} disabled defaultValue={user.identity} />
                </Space.Compact>}
                cover={ <Slider max={treeData.length} value={checkedKeys.length} defaultValue={0} disabled={true} />}
                actions={[
                    <Button><SettingOutlined key="setting" /> : {treeData.length}</Button>,
                    <Button onClick={onsubmit} type={"primary"}><EditOutlined key="edit" />权限修改</Button>,
                    <span>{user.id}</span>,
                ]}
            >
                <Tree
                    showIcon={true}
                    onCheck={onCheck}
                    checkedKeys={checkedKeys}
                    treeData={treeData}
                    checkable
                />
            </Card>
    );
};

export default UserAuthorityComponent;